<!-- 通用上传接口 -->
<template>
  <div class="common-upload">
    <el-upload
      class="upload-demo"
      action="/"
      :multiple="multiple"
      :http-request="handleUpload"
      :limit="limit"
      :file-list="fileList"
      :show-file-list="showFileList">
      <el-button v-if="type == 'button'" size="small" type="primary">{{ text }}</el-button>
      <el-link v-if="type == 'link'" type="primary">{{ text }}</el-link>
    </el-upload>
  </div>
</template>

<script>

export default {
  props: {
    // 按钮样式
    type: {
      type: String,
      default: 'button'
    },
    // 上传文字
    text: {
      type: String,
      default: '上传'
    },
    // 文件上传Url
    uploadUrl: {
      type: String,
      default: '/api/File/Upload'
    },
    // 多选
    multiple: {
      type: Boolean,
      default: () => false
    },
    // 数量
    limit: {
      type: Number,
      default: 3
    },
    showFileList: {
      type: Boolean,
      default: false
    }
  },
  components: {},
  data() {
    return {
      fileList: [], // 文件列表
    };
  },
  methods: {
    // 上传
    handleUpload(e) {
      const file = e.file
      const formData = new FormData()
      formData.append('file', file)
      this.$http.common.upload(formData, this.uploadUrl).then(res => {
        this.$emit('uploadSuccess', res.data.data)
      })
    },
  },
}
</script>
<style lang='css' scoped>
</style>